<template>
    <el-affix :offset="130" class="affix" :target="target">
        <el-button type="info" :icon="Close" circle size="default" @click="onClose" />
    </el-affix>
</template>

<script setup lang="ts">
import { inject, onUnmounted } from "vue";
import { Close } from "@element-plus/icons-vue";
import { debounce } from "lodash-es";

//获取自定义全局方法
const { emitter } = inject<any>("method");

//父传子
interface Props {
    target?: string | null;
}
withDefaults(defineProps<Props>(), {
    target: null,
});

//关闭按钮点击事件（防抖）
const onClose = debounce(() => emitter.emit("grading-paper-table-close"), 200);

//组件销毁时取消防抖
onUnmounted(() => {
    onClose.cancel();
});
</script>

<style scoped lang="less">
.affix {
    position: absolute;
    right: 1px;
    z-index: 1000;
}
</style>
